<template>
	<view>
		<cu-custom bgColor="bg-E96141" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">个人资料</block>
		</cu-custom>
		<form>
			<view class="cu-form-group">
				<view class="title">账号</view>
				<input v-model="phone" disabled="disabled"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">姓名</view>
				<input placeholder="请输入姓名" name="input" 
					v-model="realname"
					maxlength="10"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">性别</view>
				<switch class='switch-sex' 
					@change="SwitchC" 
					:class="switchC?'checked':''" 
					:checked="switchC?true:false"
					:color="'#E96141'"></switch>
			</view>
			<view class="cu-form-group">
				<view class="title">出生日期</view>
				<view class="uni-list-cell-db">
					<picker mode="date" v-model="birthday" :start="startDate" :end="endDate" 
						@change="birthdayChange">
						<view class="uni-input">
							{{birthday?birthday:'选择日期'}}</view>
					</picker>
				</view>
			</view>
			
			<!-- <view class="cu-form-group margin-top">
				<view class="title">省市区县</view>
				<input placeholder="请输入省市区县" name="input" 
					v-model="myFormData.proCityAreaName"
					maxlength="30"></input>
			</view> -->
			<view class="cu-form-group">
				<view class="title">详细住址</view>
				<textarea placeholder="详细住址(忽略省市区县)，如：楼号、单元、楼层、门牌号等(100字以内)" 
					maxlength="100"
					:value="address"
					:auto-size="{ minRows: 3, maxRows: 5 }"
					@input="addressInput"
					style="border:1px solid #eeeeee; padding: 10upx;"/>
			</view>
			
			 <view class="cu-form-group margin-top">
				<view class="title">邀请码</view>
					<input placeholder="请输入邀请码" name="input"
						v-model="tuijiancode"
						maxlength="10"
						:disabled="dis"
						></input>
						
			</view> 
			
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue lg" 
					style="background-color: #E96141;" 
					@click="onSubmit">保存</button>
			</view>
		</form>
	</view>
</template>

<script>
	import {
		USER_ACCOUNT,
	} from "@/common/util/constants"
	import moment from 'moment'
	
	export default {
		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				index: -1,
				switchC: true,
				imgList: [],
				uploadUrl:"/sys/common/upload",
				
				//个人资料
				phone:'',
				realname:'',
				sex:'2',
				birthday:'',
				address: '',
				tuijiancode: '',
				dis: false,
				
				myFormData:{
					phone:'',
					realname:'',
					sex:'2',
					birthday:'',
					address: '',
					tuijiancode: '',
				},
			};
		},
		onLoad: function () {
			this.getMemberNewestInfo();
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		methods: {
			//详情地址填写
			addressInput(e){
				let value = e.detail.value
				if(!value || value.length<1){
					this.address = ''
				}
				this.address = value
			},
			//备注填写
			remarkInput(e){
				let value = e.detail.value
				if(!value || value.length<1){
					this.remark = ''
				}
				this.remark = value
			},
			//获取会员最新信息, 然后更新到本地缓存
			getMemberNewestInfo(){
				uni.showLoading({
					title: '加载中..',
					mask: true,
				})
				let that = this
				that.$http.get("/vip/vipmember/queryByToken",{}).then(res=>{
					if(res.data.success){
						uni.hideLoading()
						/*
							address: "汉中市中心1号院100室"
							city: "610103"
							endtime: "2023-01-13"
							id: "1475023397223403522"
							identity: "52345234523453452"
							isVip: "Y"
							phone: "17189211859"
							realname: "欧阳认知"
							sex: 1
							startTime: "2022-01-12"
							tuijiancode: "tjm999"
							username: "行者"
							vipLevelId: 3
							vipLevelTitle: "尊享会员"
							yuyuecount: "22"
						*/
					   let jsonData = res.data.result
					   that.phone = jsonData.phone
					   that.realname = jsonData.realname
					   that.address = jsonData.address
					   that.tuijiancode = jsonData.tuijiancode
					   that.sex = jsonData.sex
					   that.dis = that.tuijiancode ? true : false
					   
					   if(that.sex=='1'){
					     that.switchC = true
					   }else{
					     that.switchC = false
					   }
					   
					   that.birthday = jsonData.birthday
					   if(that.birthday){
					   		that.birthday = moment(that.birthday).format('YYYY-MM-DD')
					   }
					}else{
						uni.hideLoading()
					}
				}).catch(err => {
					uni.hideLoading()
				});
			},
			//选择出生日期
			birthdayChange: function(e) {
				console.info(e.target.value+"---:e")
				this.birthday = e.target.value
			},
			getDate(type) {
				
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				
				if (type === 'start') {
					year = year - 100;
				} else if (type === 'end') {
					year = year;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				console.info(`${year}-${month}-${day}`+"---:getDate")
				return `${year}-${month}-${day}`;
			},
			//提交保存
			onSubmit() {
				let _params = {
					phone: this.phone,
					realname: this.realname,
					sex: this.sex,
					birthday: this.birthday,
					address: this.address,
					tuijiancode: this.tuijiancode
				}
				uni.showLoading({
					title: '保存中..',
					mask: true,
				})
				let that = this
				that.$http.put('/vip/vipmember/edit', _params).then(res=>{
					if (res.data.success){
						uni.hideLoading()
						that.$tip.success('保存成功')
						setTimeout(function() {
							uni.navigateBack({
								delta: 1
							})
						}, 500);
					}else{
						uni.hideLoading()
						that.$tip.toast(res.data.message);	
					}
				}).catch(()=>{
					uni.hideLoading()
				});
			},
			DateChange(e) {
				this.myFormData.birthday = e.detail.value
			},
			//性别切换
			SwitchC(e) {
				this.switchC = e.detail.value
				if(this.switchC==true){
					this.sex='1'
				}else{
					this.sex='2'
				}
			},
		}
	}
</script>

<style>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
</style>
